<template>
    <div>
      <tableComp
        :selectMap="selectMap"
        @getList="getList"
        :total="total"
        ref="tableComp"
        :labelWidth="120"
        :tableWidth="150"
        :tableData="tableData"
        :column="column"
      >
        <template slot="product_img" slot-scope="scope">
          <el-image
            style="width: 100px; height: 100px"
            :src="scope.row.product_img"
            :fit="fit"
          ></el-image>
        </template>
        <template slot="poster_img" slot-scope="scope">
          <el-image
            style="width: 100px"
            :src="scope.row.poster_img"
            :fit="fit"
          ></el-image>
        </template>
        <template slot="statusName" slot-scope="scope">
          <el-select
            size="small"
            @change="
              (e) => {
                onChangeStatus(e, scope.row);
              }
            "
            v-model="scope.row.status"
            style="width: 200px"
          >
            <el-option
              v-for="(item, index) in statusList"
              :key="index"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </template>
      </tableComp>
    </div>
  </template>
  
  <script>
  import { settleLogList,getTransList } from "@/api/order";
  import customPage from "@/components/customPage";
  export default {
    components: { customPage },
    props: ["shopname"],
    data() {
      return {
        tableData: [],
        total: 0,
        //1 待下单  2待审核 3已发货 4已结算  5审核不过
        statusList: [
          {
            label: "待下单",
            value: 1,
          },
          {
            label: "待审核",
            value: 2,
          },
          {
            label: "已发货",
            value: 3,
          },
          {
            label: "已结算",
            value: 4,
          },
          {
            label: "审核不过",
            value: 5,
          },
        ],
        selectMap: {
            trans_type: [],
        },
        column: [
          {
            label: "id",
            fixed: true,
            prop: "id",
          },
          {
            label: "结算类型",
            hidden:true,
            search:{
                type:'select'
            },
            prop: "trans_type",
          },
          {
            label: "订单ID",
            prop: "promoter_order_id",
          },
          {
            label: "推广员之前余额",
            prop: "before_promoter_balance",
          },
          {
            label: "操作金额",
            prop: "price",
          },
          {
            label: "推广员之后余额",
            prop: "after_promoter_balance",
          },
          {
            label: "产品账户之前余额",
            prop: "before_product_balance",
          },
          {
            label: "引流费用",
            prop: "drainage_fee",
          },
          {
            label: "产品账户之后余额",
            prop: "after_product_balance",
          },
          {
            label: "结算时间",
            prop: "settle_time",
          },
          {
            label: "类型",
            prop: "statusName",
          },
          {
            label: "推广员姓名",
            prop: "name",
            search:{
                type:'input'
            },
          },
          {
            label: "产品名称",
            prop: "product_name",
          },
        ],
      };
    },
    mounted() {
      this.$refs.tableComp.getList();
      getTransList().then((res)=>{
        this.selectMap['trans_type'] = res.map((item)=>({
            name:item.name,
            code:item.trans_type
        }))
        console.log(this.selectMap)
      })
    },
    methods: {
      getList({ flag, params }) {
        if (!flag) {
          this.tableData = [];
        }
        settleLogList(params).then((res) => {
          this.tableData = res.data || [];
          this.total = res.total;
        });
      }
    },
  };
  </script>
  
  <style lang="scss" scoped>
  </style>
  